<template>
  <div>
    components-A
    <div style="margin-top: 100px">
      <router-link to="/component-A/A/children-A/A">children-A</router-link>
      <span style="display: inline-block; width: 50px"></span>
      <router-link to="/component-A/A/children-B/B">children-B</router-link>
    </div>

    <router-view style="margin-top: 100px"></router-view>
  </div>
</template>

<script>
export default {
  props: {
    id: {
      type: String,
      default: ''
    }
  },
  mounted() {
    console.log('$router.params.id: ' + this.id)
  }
}
</script>

<style>
</style>